<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,user-scalable=no,minimal-ui">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../img/asset-favico.ico">
    <title>编辑信息</title>
    <link rel="stylesheet" href="../css/page-health-orderInfo.css"/>
    <link rel="stylesheet" href="../plugins/elementui/index.css"/>
    <script src="../plugins/jquery/dist/jquery.min.js"></script>
    <script src="../plugins/healthmobile.js"></script>
    <script src="../plugins/datapicker/datePicker.js"></script>
    <script src="../plugins/vue/vue.js"></script>
    <script src="../plugins/vue/axios-0.18.0.js"></script>
    <script src="../plugins/elementui/index.js"></script>

    <script>
        var id = getUrlParam("id");
    </script>
    <style>
        /* 容器 <div> - 需要定位下拉内容 */
        .dropdown {
            position: relative;
            display: inline-block;
        }

        /* 下拉内容 (默认隐藏) */
        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        }

        /* 下拉菜单的链接 */
        .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
        }

        /* 鼠标移上去后修改下拉菜单链接颜色 */
        .dropdown-content a:hover {
            background-color: #f1f1f1
        }

        /* 在鼠标移上去后显示下拉菜单 */
        .dropdown:hover .dropdown-content {
            display: block;
        }

    </style> <style>
    /* 容器 <div> - 需要定位下拉内容 */
    .dropdown {
        position: relative;
        display: inline-block;
    }

    /* 下拉内容 (默认隐藏) */
    .dropdown-content {
        display: none;
        position: absolute;
        background-color: #f9f9f9;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    }

    /* 下拉菜单的链接 */
    .dropdown-content a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

    /* 鼠标移上去后修改下拉菜单链接颜色 */
    .dropdown-content a:hover {
        background-color: #f1f1f1
    }

    /* 在鼠标移上去后显示下拉菜单 */
    .dropdown:hover .dropdown-content {
        display: block;
    }

</style>
</head>
<body>
<script>
    function ADD(obj) {
        var cookie_name = "login_member_id";
        var allcookies = document.cookie;
        //索引长度，开始索引的位置
        var cookie_pos = allcookies.indexOf(cookie_name);

        // 如果找到了索引，就代表cookie存在,否则不存在
        if (cookie_pos !== -1) {
            // 把cookie_pos放在值的开始，只要给值加1即可
            //计算取cookie值得开始索引，加的1为“=”
            cookie_pos = cookie_pos + cookie_name.length + 1;
            //计算取cookie值得结束索引
            var cookie_end = allcookies.indexOf(";", cookie_pos);

            if (cookie_end === -1) {
                cookie_end = allcookies.length;

            }
            //得到想要的cookie的值
            var value = unescape(allcookies.substring(cookie_pos, cookie_end));
        }
        obj.href += value;
    }
</script>
<div class="top-header" style="position: relative;z-index: 5">
    <span class="f-left"><i class="icon-back" onclick="history.go(-1)"></i></span>
    <span class="center">传智健康</span>
    <span class="f-right">
<div class="dropdown">
  <i class="icon-more" id="AA"></i>
  <div class="dropdown-content" style="left:unset; right:0;">
    <a href="../pages/member_personal.html?id=" onclick="ADD(this)">个人中心</a>
    <a href="../pages/families_before.html">添加关系人</a>
    <a href="../pages/u_password.html?id=" onclick="ADD(this)">修改密码</a>
    <a href="#">退出账号</a>
  </div>
</div>
    </span>
</div>
<div id="app" class="app">
<div class="form-info">

    <div class="info-title">
        <span class="name">体检人信息</span>
    </div>
    <el-table size="small" current-row-key="id" :data="dataList" stripe highlight-current-row>
        <el-table-column type="index" align="center" label="序号"></el-table-column>
        <el-table-column prop="name" label="姓名" align="center"></el-table-column>
        <el-table-column prop="age" label="年龄" align="center"></el-table-column>
        <el-table-column prop="sex" label="性别" align="center">
            <template slot-scope="scope">
                <span>{{scope.row.sex == '1' ? '男' : '女'}}</span>
            </template>
        </el-table-column>

        <el-table-column prop="idCard" label="身证号" align="center"></el-table-column>
        <el-table-column label="操作" align="center">
            <template slot-scope="scope">
                <el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button>
            </template>
        </el-table-column>
    </el-table>

    <div class="info-title">
    <span class="name">
        <el-button icon="el-icon-circle-plus-outline" type="primary" size="medium" @click="dialogFormVisible = true">新增体检人</el-button>
    </span>
    <el-dialog title="新增体检人" :visible.sync="dialogFormVisible">
        <form class="info-form">
            <div class="input-row">
                <label>体检人</label>
                <input v-model="orderInfo.name" type="text" class="input-clear" placeholder="请输入姓名">
            </div>
            <div class="input-row single-radio">
                <label class="radio-title">性别</label>
                <div class="radio-list">
                    <div class="radio">
                        <input v-model="orderInfo.sex" id="item1" type="radio" name="sex" value="1" checked>
                        <label for="item1"></label>
                        <span>男</span>
                    </div>
                    <div class="radio">
                        <input v-model="orderInfo.sex" id="item2" type="radio" name="sex" value="2">
                        <label for="item2"></label>
                        <span>女</span>
                    </div>
                </div>
            </div>
            <div class="input-row">
                <label>身份证号</label>
                <input v-model="orderInfo.idCard" type="text" class="input-clear" placeholder="请输入身份证号">
            </div>
            <div class="input-row">
                <label>年龄</label>
                <input v-model="orderInfo.age" type="text" class="input-clear" placeholder="请输入年龄">
            </div>
        </form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取 消</el-button>
            <el-button type="primary" @click="submitOrder()" >确 定</el-button>
        </div>
    </el-dialog>
    </div>
</div>
</div>
<script>
    var vue = new Vue({
        el: '#app',
        data: {
            orderInfo: {
                setmealId: id,
                sex: '1'
            },//预约信息
            dataList:[],
            dialogFormVisible :false,
            form: {
                name: '',
                region: '',
                date1: '',
                date2: '',
                delivery: false,
                type: [],
                resource: '',
                desc: ''
            },
            formLabelWidth: '120px'



        },created() {
            //发送ajax请求查询数据回显到表格
            this.findPage()
        },
        methods: {
            findPage(){
                axios.get("/families/findAll.do").then((res)=>{
                    if (res.data.flag){
                        this.dataList = res.data.data
                    }else {
                        //失败
                        this.$message.error(res.data.message)
                    }
                })
            },
            //提交体检人信息
            addFamilies(){
                //跳转到
                window.location = "./families.html"
            },
            // 删除
            handleDelete(row) {
                this.$confirm("你确定要删除当前文件?","提示",{
                    type:'warning'
                }).then(()=>{
                    //发送ajax请求,将idCard发送到controller进行处理
                    axios.post("/families/deleteByIdCard.do",row).then((res)=>{
                        if(res.data.flag){
                            //删除成功
                            this.$message({
                                type:'success',
                                message:res.data.message
                            })
                            //重新查询
                            this.findPage();
                        }else {
                            //删除失败
                            this.$message.error(res.data.message);
                        }
                    })
                }).catch(()=>{
                    this.$message({
                        type:'success',
                        message:"操作取消"
                    })
                })
            },
            //提交体检人信息
            submitOrder() {
                //校验身份信息
                if (!checkIdCard(this.orderInfo.idCard)) {
                    this.$message.error("身份证号码输入错误，请重新输入");
                    return false;
                }
                if(!checkAge(this.orderInfo.age)){
                    this.$message.error("年龄格式不正确，请重新输入");
                    return false;
                }
                //校验成功,发送ajax请求
                axios.post("/families/add.do", this.orderInfo).then((res) => {
                    if (res.data.flag) {
                        //添加成功跳转页面
                        // window.location.href = "./families_before.html"
                        this.$message({
                            type:'success',
                            message:res.data.message
                        })
                        this.findPage();
                        this.dialogFormVisible = false
                    }else {
                        //添加失败
                        this.$message.error(res.data.message)
                    }

                })
            }
        },
    });
</script>
</body>
</html>